import {Injectable} from '@angular/core';
import * as Color from 'color-js/color';

@Injectable({
  providedIn: 'root'
})
export class ThemeService {

  colors = [
    {name: 'ngs-color1', value: '#c23034'},
    {name: 'ngs-color2', value: '#038387'},
    {name: 'ngs-color3', value: '#018574'},
    {name: 'ngs-color4', value: '#0063B1'},
    {name: 'ngs-color5', value: '#2D7D9A'},
    {name: 'ngs-color6', value: '#0099BC'},
  ];

  color: { name: string; value: string };

  constructor() {
    const localColor = localStorage.getItem('themeColor') || 'ngs-color5';
    for (const c of this.colors) {
      if (c.name === localColor) {
        this.color = c;
        break;
      }
    }
  }

  colorDarken(color, n: number) {
    color = Color(color);
    return color.darkenByAmount(n).toCSS();
  }
}
